﻿@{
    ViewBag.Title = "关卡释意列表";
}
<div class="wrapper animated fadeInRight autoHeight">
    <!-- Panel Other -->
    <div class="row autoHeight" style="background-color: #fff;">
        <div class="col-sm-12 col-sm-leftRight">
            <!-- Example Toolbar -->
            <div class="example">
                <div class="btn-group form-inline" id="exampleToolbar" role="group" style="margin-bottom:1px;">
                    <button id="btnAdd" type="button" class="btn btn-outline btn-primary">
                        <i class="glyphicon glyphicon-plus" aria-hidden="true">新增</i>
                    </button>
                    <button id="btnEdit" type="button" class="btn btn-outline btn-primary">
                        <i class="glyphicon glyphicon-pencil" aria-hidden="true">编辑</i>
                    </button>
                    <button id="btnDelete" type="button" class="btn btn-outline btn-danger">
                        <i class="glyphicon glyphicon-trash" aria-hidden="true">删除</i>
                    </button>
                    <button id="btnImportAdd" type="button" class="btn btn-outline btn-primary">
                        <i class="glyphicon glyphicon-plus" aria-hidden="true">导入</i>
                    </button>
                    <div class="form-group" style="width:150px">
                        <input id="keyword" name="keyword" type="text" class="form-control" placeholder="请输入单词名称">
                    </div>
                    <div class="form-group">
                        <button id="btnSearch" class="btn btn-primary" type="button"><i class="fa fa-search"></i>&nbsp;查询</button>
                    </div>
                </div>
                <table id="exampleTableToolbar" data-mobile-responsive="true" data-radio="true" style="table-layout: fixed !important;"></table>
            </div>
            <!-- End Example Toolbar -->
        </div>
    </div>
    <!-- End Panel Other -->
</div>
<!-- 手工添加、编辑单词 -->
<div id="org_form" style="width: 460px; overflow: hidden; display: none;">
    <form class="form-horizontal m-t" id="orgFormTable" method="post">
        <div class="form-group">
            <label class="col-sm-3 control-label">单词名称<span class="glyphicon glyphicon-asterisk requiredtitle"></span>：</label>
            <div class="col-sm-7">
                <input id="word" name="word" type="text" autoComplete="off" class="form-control input-sm" placeholder="请输入单词" title="请输入单词" required="" aria-required="true" />
                <input type="hidden" id="ws_id" name="ws_id" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">国际音标<span class="glyphicon glyphicon-asterisk requiredtitle"></span>：</label>
            <div class="col-sm-7">
                <input id="gj_symbol" name="gj_symbol" type="text" autoComplete="off" class="form-control input-sm" placeholder="请输入国际音标" title="请输入国际音标" required="" aria-required="true" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">KK音标：</label>
            <div class="col-sm-7">
                <input id="kk_symbol" name="kk_symbol" type="text" autoComplete="off" class="form-control input-sm" placeholder="请输入KK音标" title="请输入KK音标" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">词性：</label>
            <div class="col-sm-7">
                <input id="cp_type" name="cp_type" type="text" autoComplete="off" class="form-control input-sm" placeholder="请输入词性" title="请输入词性" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">中文释义：</label>
            <div class="col-sm-7">
                <textarea class="form-control" id="china_mean" name="china_mean" rows="3" placeholder="请输入中文解释" title="请输入中文解释"></textarea>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">短语：</label>
            <div class="col-sm-7">
                <textarea class="form-control" id="ws_phrase" name="ws_phrase" rows="3" placeholder="请输入备注信息" title="请输入备注信息"></textarea>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">例句：</label>
            <div class="col-sm-7">
                <textarea class="form-control" id="example" name="example" rows="3" placeholder="请输入备注信息" title="请输入备注信息"></textarea>
            </div>
        </div>
    </form>
</div>
<!-- Excel 导入 -->
<div id="import_form" style="width: 460px;height:100%; overflow: hidden; display: none;">
    <form class="form-horizontal m-t" id="importFormTable"  enctype="multipart/form-data">
        <div class="form-group">
            <label class="col-sm-3 control-label">单词文件<span class="glyphicon glyphicon-asterisk requiredtitle"></span>：</label>
            <div class="col-sm-8"> 
                <input id="excelFile" name="excelFile" type="file" accept=".xlsx" fileId="BusinessLicenseImg" attribute="src" class="form-control input-sm files" placeholder="请选择导入文件上传">
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-10 col-sm-offset-3">
                <a class="btn btn-primary btn-sm" href="~/Resources/excel/单词释意导入模板.xlsx">
                    <span class="glyphicon glyphicon-download"></span>
                    下载excel模板
                </a>
            </div>
        </div>
    </form>
</div>
@section footSection{
    <script src="~/Resources/mainFrame/js/plugins/prettyfile/bootstrap-prettyfile.js"></script>
    <script src="~/Resources/tools/BootstrapTableDefault.js"></script>
    <script src="~/Resources/tools/jqueryExtend.js"></script>
    <script src="~/Resources/myScript/HeadManager/wordMeanManager.js"></script>
    <script>
        $(function () {
            //初始化页面
            wordMeanManager.initPage();
        });
    </script>
}